<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        function method01(shengValue){
            //获取省选中项
            //获取市下拉列表对象
            var selectShi=document.getElementById('shi');
            if(shengValue=='shanxi'){
                //让市下拉列表里的选项只保留一个
                selectShi.length=1;
                //根据省选中项，创建相应的option对象
                var option01=new Option('太原市');
                option01.value='taiyuan';
                var option02=new Option('运城市');
                option02.value='yuncheng';
                var option03=new Option('大同市');
                option03.value='datong';
                var option04=new Option('平遥市');
                option04.value='pingyao';
                //把option对象添加到市下拉列表对象里
                selectShi.add(option01);
                selectShi.add(option02);
                selectShi.add(option03);
                selectShi.add(option04);
            }
            if(shengValue=='sx'){
                //让市下拉列表里的选项只保留一个
                selectShi.length=1;
                //根据省选中项，创建相应的option对象
                var option01=new Option('西安市');
                option01.value='xian';
                var option02=new Option('咸阳市');
                option02.value='xianyang';
                var option03=new Option('宝鸡市');
                option03.value='baoji';
                var option04=new Option('渭南市');
                option04.value='weinan';
                //把option对象添加到市下拉列表对象里
                selectShi.add(option01);
                selectShi.add(option02);
                selectShi.add(option03);
                selectShi.add(option04);
            }
            if(shengValue=='hn'){
                //让市下拉列表里的选项只保留一个
                selectShi.length=1;
                //根据省选中项，创建相应的option对象
                var option01= new Option('开封市');
                option01.value='kaifeng';
                var option02= new Option('郑州市');
                option02.value='zz';
                var option03= new Option('洛阳市');
                option03.value='luoyang';
                var option04= new Option('驻马店市');
                option04.value='zhumadain';
                //把option对象添加到市下拉列表对象里
                selectShi.add(option01);
                selectShi.add(option02);
                selectShi.add(option03);
            }
        }
    </script>
</head>
<body>
<form name="login">
    <!-- this 表示当前对象即select对象， this.value表示被选中选项的value值-->
    出生地： 省：<select name="sheng" onchange="method01(this.value)">
    <option value="wu">-----请选择------</option>
    <option value="shanxi">山西</option>
    <option value="sx">陕西</option>
    <option value="hn">河南</option>
</select>
    市：<select id="shi">
    <option>-----请选择------</option>
</select>
</form>
</body>
</html>